<template>
  <div class="tuijian">
    <div class="content">
      <Banner :bannpic="newarr" />
      <Caidan :newarr="newfindss" />

      <img src="001.jpg" alt="" class="nvwang" />
      <List :bann="newsxsp.sxban.imgbann" :pics="newsxsp.sxpic">
        <p slot="tit">生鲜</p>
      </List>
      <List :bann="newsxspss.spban.imgbann" :pics="newsxspss.sppic" class="sp">
        <p slot="tit">食品</p>
      </List>
      <Like :goodsstr="newpics">
        <h3 slot="likename" class="hh">猜你喜欢</h3>
      </Like>
    </div>
  </div>
</template>

<script>
import Banner from "../components/Home/banner.vue";
import Caidan from "../components/Home/caidan.vue";
import List from "../components/Home/list.vue";
import Like from "../components/Home/like";
// import getapi from "../apis/getlink";
export default {
  components: {
    Banner,
    Caidan,
    List,
    Like,
  },
  data() {
    return {
      sxban: "",
      sxpic: "",
      spban: "",
      sppic: "",
    };
  },
  created() {
    // getapi("/goodlift/data").then((ok) => {
    //   // console.log(ok.data.sx.sxpic);
    //   this.sxban = ok.data.sx.sxban;
    //   this.sxpic = ok.data.sx.sxpic;
    //   this.spban = ok.data.sp.spban;
    //   this.sppic = ok.data.sp.sppic;
    // });
    this.$store.dispatch("gsxsp", { url: "/goodlift/data" });
    this.$store.dispatch("getlists", { url: "/goodlift/data" });
    this.$store.dispatch("getnewfind", { url: "/goodlift/data" });
    this.$store.dispatch("banlink", { url: "/goodlift/data" });
  },
  // mounted(){
  //   console.log("nkjewnvjkewrbjg", this.$store.state.homem.newsxs);
  // },
  computed: {
    newpics() {
      return this.$store.state.listm.newpic;
    },
    newfindss() {
      return this.$store.state.homem.newfinds;
    },
    newarr() {
      return this.$store.state.homem.newbann;
    },
    newsxsp() {
      return this.$store.state.homem.newsxs;
    },
    newsxspss() {
      return this.$store.state.homem.newsps;
    },
    newb() {
      return this.newsxsp.sxban.imgbann;
    },
  },
};
</script>

<style scoped>
.tuijian {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #eeeeee;
  margin-bottom: 0.68rem;
}
.header {
  width: 100%;
  height: 0.9rem;
}
.nvwang {
  width: 3.7rem;
  height: 0.8rem;
}
.content {
  /* flex: 1;
  overflow: auto; */
  width: 100%;
  min-height: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.s1,
.n1 {
  position: fixed;
  top: 0;
  z-index: 100;
  margin-bottom: 1rem;
}
.n1 {
  margin-top: 0.53rem;
}
.sp {
  background-color: #ffeac9;
}
.hh {
  font-weight: 700;
  margin: 0.15rem 0;
}
</style>